<!--车队审核页面-->
<template>
	<view class="page_all">
		<view class="page_titleArea">
			<view class="page_title_line">
				<view class="page_title_line_left" @click="leftClick()"><image src="../../static/all/back_white.png" style="width:50rpx;height:50rpx;"></image></view>
				<view class="page_title_line_middle">车队审核</view>
				<view class="page_title_line_left"></view>
			</view>
		</view>
		<scroll-view class="page_contentArea" style="background-color:#F7F7F7;"
		             enable-flex="true"
		             show-scrollbar="true"
		             scroll-y="true"
		             @scrolltoupper="scroll_top()"
		             @scrolltolower="notLoadingData && scroll_bottom()">
			<!--状态栏区域-->
			<view class="list_order_status_box">
				<view :class="statusSelect==0?'list_order_status_item2':'list_order_status_item1'" @click="setStatusSelect(0)">全部</view>
				<view :class="statusSelect==1?'list_order_status_item2':'list_order_status_item1'" @click="setStatusSelect(1)">用车审核</view>
				<view :class="statusSelect==2?'list_order_status_item2':'list_order_status_item1'" @click="setStatusSelect(2)">还车审核</view>
				<view :class="statusSelect==3?'list_order_status_item2':'list_order_status_item1'" @click="setStatusSelect(3)">审核完毕</view>
				<view :class="statusSelect==4?'list_order_status_item2':'list_order_status_item1'" @click="setStatusSelect(4)">驳回</view>
			</view>
			<!--数据区域-->
			<!--数据块开始-->
			<view v-if="taskList.length==0&&noDataShow" class="list_noData">
				<image src="../../static/list/noData.png" style="width:200rpx;height:250rpx;"></image>
			</view>
			<view v-if="taskList.length>0" class="list_order_box" style="position:relative;"
			      v-for="(item,index) in taskList" :key="index" @click="gotoTaskDetail(item.accessTaskId)">
				<view class="list_order_row" >
					<view class="list_order_row_L">申请人</view>
					<view class="list_order_row_R">{{item.createName}}</view>
				</view>
				<view class="list_order_row" >
					<view class="list_order_row_L">部门</view>
					<view class="list_order_row_R">{{item.location}}</view>
				</view>
				<view class="list_order_row" >
					<view class="list_order_row_L">时间</view>
					<view class="list_order_row_R">{{item.startDate.substr(0,16)}}至{{item.endDate.substr(5,11)}}</view>
				</view>
				<view class="list_order_row" >
					<view class="list_order_row_L">车辆</view>
					<view class="list_order_row_R">{{item.carModel}}<span style="padding:30rpx;"></span>{{item.carLicense}}</view>
				</view>
				<view :class="item.lastEventType"><span style="padding:5rpx;"></span>{{item.text}}<span style="padding:5rpx;"></span></view>
				<view style="width:650rpx;height:10rpx;"></view>
			</view>
			<!--数据块结束-->
			
			<u-tabbar :value="bottomTab" @change="name => bottomTab = name" activeColor="#1485FF">
				<u-tabbar-item text="首页" icon="home" @click="gotoPage('init')"></u-tabbar-item>
				<u-tabbar-item text="车队审核" icon="account"></u-tabbar-item>
			</u-tabbar>
			
			<!--结尾预留空白行-->
			<view style="width:650rpx;height:100rpx;flex-shrink:0;"></view> <!--避免最后一个元素被挡住一部分，可以调整height的大小，微调间隙大小-->
		</scroll-view>
		
		<!--分页提示信息-->
		<view v-if="isShowinfo" class="info_popup_bottom">{{infoMsg}}</view>
		
	</view>
</template>

<script>
	import utils from "@/utils/business/services.js";
	export default {
		data() {
			return {
				statusSelect: 0, //查询筛选区状态选择控制变量
				bottomTab: 1, //底部链接tabbar高亮控制
				form_query: {
					pageSize:5,  //每页5条数据（固定项）
					pageIndex:1,       //第几页（固定项）
					status:"", //用于卡片查询组合条件第1个
					steps:"", //用于卡片查询组合条件第2个
				},
				
				/**************************以下是单据列表相关变量******************************/
				noDataShow:false , //执行完查询后，如果没有数据再置为true
				taskList:[] , //我的用车申请单列表数据
				total:0, //总共多少条数据
				notLoadingData:true, //是否正在加载中（如果加载中的话则不能进行上下滑动）
				isShowinfo:false, //是否显示分页提示信息
				infoMsg:"", //分页提示信息显示内容
				/**************************以上是单据列表相关变量******************************/
				
				/***************************以下是状态标准化变量*******************************/
				//执行者角色（角色简称）：申请人（申请人）、部门审核人员（部门）、部门车管（部门车管）、车队审核人员（车队）、司机（司机）、系统执行（系统）
				//流程走向请参考项目文档
				status_1:"新建(部门用车待审)", //部门:用车待审   【1：新建单据（部门用车审核前）】
				status_1_5:"结束(申请人撤销)", //结束:申请人撤销   【1.5：申请人撤销订单】
				status_1_8:"结束(部门30分钟内未审)", //结束:申请人撤销   【1.8：部门30分钟内未审】
				
				status_2:"部门通过(司机待指派)", //部门:同意用车   【2：部门审核通过（部门用管指派司机前）】
				status_2_5:"结束(部门用车审核驳回)", //结束:部门用车审核驳回   【2.5部门用车审核驳回】
				status_2_6:"已指派司机(车队用车待审)", //车队:用车待审   【2.6：部门车管已经指派司机（车队用车审核前）】
				status_2_8:"结束(车管未及时指派司机)", //结束:车管未及时指派司机   【2.8：部门车管30分钟内未指派司机】 2025-05补充
				
				status_3:"车队通过(司机待取钥匙)", //车队:同意用车   【3：车队用车审核通过】
				status_3_5:"结束(车队用车审核驳回)", //结束:车队用车审核驳回   【3.5车队用车审核驳回】
				status_3_8:"结束(司机未取钥匙)", //结束:司机未取钥匙   【3.8：未取钥匙（10：结束）】
				
				status_4:"司机已取钥匙(待用车)", //司机:已取钥匙   【4：取钥匙】
				status_5:"司机用车中(待还车)", //司机:使用车辆   【5：使用车辆】
				status_6:"司机已还车(待还钥匙)", //司机:归还车辆   【6：归还车辆】
				status_7:"司机已还钥匙(车队还车待审)", //车队:还车待审   【归还钥匙（车队还车审核前）】
				
				status_8:"正常结束", //正常结束   【8：车队还车审核通过后（10：结束）】
				status_8_5:"有事故(部门事故待确认)", //部门:事故待确认   【8.5车队还车审核有事故（部门确认事故前）】
				
				status_9:"结束(有事故)", //结束:有事故   【9：部门确认事故（10：结束）】
				status_9_1:"终止流程", //终止流程   【9.1：终止流程（10：结束）】 （2024-04补充：申请人、部门车管、机关车管、车队管理员，可以在取钥匙之前终止流程）
				status_10:"", //   【无状态描述】
				/***************************以下是状态标准化变量*******************************/
				
				//在此之上补充变量
			}
		},
		onLoad(option) {
			getApp().globalData.query_flag=0; //在子页面（提交成功后需要刷新父页面）中将刷新控制变量置为0
			if(JSON.stringify(option)!="{}"){ //定位卡片参数
				this.statusSelect=option.statusSelect;
				console.log('参数中的卡片状态statusSelect==',this.statusSelect);
				this.setStatusSelect(this.statusSelect); //方法中已经存在了“取列表”的调用了
			}
		},
		onShow() {
			console.log("执行了onShow方法");
			/******************以下是根据全局变量调用处理方法********************/
			//可以利用onShow方法每次显示都会执行一次的特性，进行变量的交互
			if(getApp().globalData.query_flag==1){ //刷新本页面控制变量（在明细中进行审核或是其他流程操作，列表记录状态改变，回退需要刷新本页）
				console.log("执行了返回在onShow方法内刷新");
				
				this.reset_fenye(); //初始化分页数据
				this.getTaskList_car(); //取用车申请单列表
			}
			/******************以上是根据全局变量调用处理方法********************/
		},
		methods: {
			/******************************以下是分页方法*********************************/
			//（分页）到顶触发
			scroll_top(){
				console.log("&&触发了到顶条件");
				this.notLoadingData=true;
			},
			//（分页）到底触发
			scroll_bottom(){
				console.log("##触发了加载新数据条件"); 
				//1:屏蔽@scrolltolower函数调用
				this.notLoadingData=false;
				//2：给出加载新数据提示
				this.isShowinfo=true;
				this.infoMsg="新数据加载中";
				//3：执行加载新数据
				var allTotal=this.form_query.pageIndex * this.form_query.pageSize;
				if(allTotal < this.total){ //当前条数小于总条数 则增加请求页数
					this.form_query.pageIndex++;
					this.getTaskList_car();
				}else{
					this.isShowinfo=true;
					this.infoMsg="没有更多数据了！";
					setTimeout(() => {
						//显示1000毫秒后关闭分页信息提示
						this.isShowinfo=false;
						this.infoMsg="";
					}, 1000);
				}
				//4：放开@scrolltolower函数调用
				//this.notLoadingData=true; //这一步放在getTaskList()方法的成功处理部分
			},
			//（分页）初始化分页相关变量
			reset_fenye(){
				//初始化分页数据
				this.taskList=[]; //列表数据集合（初始化分页参数）
				this.total=0; //总共多少条数据
				this.notLoadingData=true; //没有数据正在加载中
				this.form_query.pageSize=5; //每页5条数据
				this.form_query.pageIndex=1; //第几页
			},
			/******************************以上是分页方法*********************************/
			/******************************以下是通用方法*********************************/
			//顶部导航回退箭头点击触发
			leftClick(){
				utils.pageBack();
			},
			//隐藏系统键盘
			hideKeyboard() {
				uni.hideKeyboard();
			},
			//列表区域上方状态切换区域
			setStatusSelect(index) {
				this.reset_fenye(); //初始化分页数据
				this.statusSelect=index;
				//流程走向请参考项目文档
				//1：新建单据（部门用车审核前）200000
				//1.5：申请人撤销订单 300100
				//1.8：部门30分钟内未审核 300300
				//2：部门审核通过（部门用管指派司机前）300000
				//2.5：部门用车审核驳回 300200
				//2.6：部门车管已经指派司机（车队用车审核前）350000
				//2.8：部门车管30分钟内未指派司机 350100  2025-05补充
				//3：车队用车审核通过 400000
				//3.5：车队用车审核驳回 400100
				//3.8：未取钥匙（10：结束）500100
				//4：取钥匙 500000
				//5：使用车辆 600000
				//6：归还车辆 700000
				//7：归还钥匙（车队还车审核前）800000
				//8：车队还车审核通过后（10：结束）900000
				//8.5车队还车审核有事故（部门确认事故前）900100
				//9：部门确认事故（10：结束）1000000
				//9.1：终止流程（10：结束）（2024-04补充：申请人、部门车管、机关车管、车队管理员，可以在取钥匙之前终止流程）
				//10：结束（无状态描述）
				
				//设定查询条件
				if(index==0){ //全部
					this.form_query.steps="";
				}
				if(index==1){ //用车审核（2.6）
					this.form_query.steps="350000,driver_appointed";
				}
				if(index==2){ //还车审核（7）
					this.form_query.steps="800000,key_put";
				}
				if(index==3){ //审核完毕（3  3.8  4  5  6  7  8  8.5  9  9.1）
					this.form_query.steps="400000,car_approved|500100,task_overtime|500000,key_got|";
					this.form_query.steps+="600000,car_using|700000,car_parked|800000,key_put|";
					this.form_query.steps+="900000,closed|900100,acc_confirm|1000000,closed|10000000,revoked";
				}
				if(index==4){ //驳回（3.5  8.5）
					this.form_query.steps="400100,car_rejected|900100,acc_confirm";
				}
				//取列表
				this.getTaskList_car();
			},
			/******************************以上是通用方法*********************************/
			
			/******************************以下是业务方法*********************************/
			//车队管理员取用车申请单列表
			getTaskList_car(){
				var that=this;
				utils.listTask(that.form_query).then(res => { //先用这个代替
						console.log('车队审核获取我参与的用车申请单列表的返回值==',res); 
					if(res.data.status=="success"){
						var arr=res.data.rows;
						if(arr.length==0){
							this.noDataShow=true;
						}
						that.taskList=that.taskList.concat(arr); //分页用
						//that.taskList=arr; //不是分页（测试）
						that.total=res.data.total;
						that.notLoadingData=true; //表示加载完数据了，可以继续触底加载新数据了
						
						setTimeout(() => { //显示500毫秒后关闭分页信息提示
							that.isShowinfo=false;
							that.infoMsg="";
						}, 500);
						
						//申请单状态处理
						//s1:用车审核（桔色） 还车审核（桔色）  s3：审核完毕（绿色）  s4：驳回（红色）
						for(var i=0;i<that.taskList.length;i++){ 
							var status=that.taskList[i].status; //取状态项
							var step=that.taskList[i].step; //取步骤项
							var stepNum=parseInt(step.split(",")[0]); //取步骤项中的数字项
							//流程走向请参考项目文档
							//1：新建单据（部门用车审核前）200000
							//1.5：申请人撤销订单 300100
							//1.8：部门30分钟内未审核 300300
							//2：部门审核通过（部门用管指派司机前）300000
							//2.5：部门用车审核驳回 300200
							//2.6：部门车管已经指派司机（车队用车审核前）350000
							//2.8：部门车管30分钟内未指派司机 350100 2025-05补充
							//3：车队用车审核通过 400000
							//3.5：车队用车审核驳回 400100
							//3.8：未取钥匙（10：结束）500100
							//4：取钥匙 500000
							//5：使用车辆 600000
							//6：归还车辆 700000
							//7：归还钥匙（车队还车审核前）800000
							//8：车队还车审核通过后（10：结束）900000
							//8.5车队还车审核有事故（部门确认事故前）900100
							//9：部门确认事故（10：结束）1000000
							//9.1：终止流程（10：结束）（2024-04补充：申请人、部门车管、机关车管、车队管理员，可以在取钥匙之前终止流程）
							//10：结束（无状态描述）
							
							//用车审核包括：2.6
							if(status=="running" && stepNum==350000){ //2.6：部门车管已经指派司机（车队用车审核前）
								that.taskList[i].lastEventType="list_order_row_status s1";
								that.taskList[i].text=that.status_2_6;
							}
							
							//还车审核包括：7已还钥匙
							if(status=="running" && stepNum==800000){ //7：归还钥匙（车队还车审核前）
								that.taskList[i].lastEventType="list_order_row_status s1";
								that.taskList[i].text=that.status_7;
							}
							
							//审核完毕包括：3  3.8  4  5  6  7  8  8.5  9  9.1
							if(status=="running" && stepNum==400000){ //3：车队用车审核通过
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_3;
							}
							if(status=="closed" && stepNum==500100){ //3.8：未取钥匙（10：结束）
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_3_8;
							}
							if(status=="running" && stepNum==500000){ //4：取钥匙
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_4;
							}
							if(status=="running" && stepNum==600000){ //5：使用车辆
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_5;
							}
							if(status=="running" && stepNum==700000){ //6：归还车辆
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_6;
							}
							if(status=="running" && stepNum==800000){ //7：归还钥匙（车队还车审核前）
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_7;
							}
							if(status=="closed" && stepNum==900000){ //8：车队还车审核通过后（10：结束）
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_8;
							}
							//以下1种特殊情况（已经归到驳回中）：可以归为车队驳回，也可以归为审核完毕
							// if(status=="running" && stepNum==900100){ //8.5车队还车审核有事故（部门确认事故前）
							// 	that.taskList[i].lastEventType="list_order_row_status s1";
							// 	that.taskList[i].text=that.status_8_5;
							// }
							if(status=="closed" && stepNum==1000000){ //9：部门确认事故（10：结束）
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_9;
							}
							//（2024-04补充：申请人、部门车管、机关车管、车队管理员，可以在取钥匙之前终止流程）
							if(status=="closed" && step=="10000000,revoked"){ //9.1：终止流程（10：结束） 
								that.taskList[i].lastEventType="list_order_row_status s3";
								that.taskList[i].text=that.status_9_1;
							}
							
							//驳回包括：3.5  8.5
							if(status=="closed" && stepNum==400100){ //3.5车队用车审核驳回
								that.taskList[i].lastEventType="list_order_row_status s4";
								that.taskList[i].text=that.status_3_5;
							}
							if(status=="running" && stepNum==900100){ //8.5车队还车审核有事故（部门确认事故前）
								that.taskList[i].lastEventType="list_order_row_status s4";
								that.taskList[i].text=that.status_8_5;
							}
							
							//备用 1  1.5  1.8  2  2.5
							if(status=="running" && stepNum==200000){ //1：新建单据（部门用车审核前）
								that.taskList[i].lastEventType="list_order_row_status s2";
								that.taskList[i].text=that.status_1;  //新建(部门用车待审)
							}
							if(status=="closed" && stepNum==300100){ //1.5：申请人撤销订单
								that.taskList[i].lastEventType="list_order_row_status s2";
								that.taskList[i].text=that.status_1_5;
							}
							if(status=="closed" && stepNum==300300){ //1.8：部门30分钟内未审核
								that.taskList[i].lastEventType="list_order_row_status s2";
								that.taskList[i].text=that.status_1_8;
							}
							if(status=="running" && stepNum==300000){ //2：部门用车审核通过（部门用管指派司机前）
								that.taskList[i].lastEventType="list_order_row_status s2";
								that.taskList[i].text=that.status_2;
							}
							if(status=="closed" && stepNum==300200){ //2.5部门用车审核驳回
								that.taskList[i].lastEventType="list_order_row_status s2";
								that.taskList[i].text=that.status_2_5;
							}
							//2025-05补充2.8未指派司机完结
							if(status=="closed" && stepNum==350100){ //2.8：未指派司机（10：结束）
								that.taskList[i].lastEventType="list_order_row_status s2";
								that.taskList[i].text=that.status_2_8;
							}
						}//for结束
					}
					if(res.data.status=="error"){
						let msg=res.data.message;
						uni.navigateTo({
							url:'/pages/error/error?errorMsg='+msg 
						}) 
					}
				}).catch(error => {
					uni.navigateTo({
						url:'/pages/error/error?errorMsg='+error
					})
				})
			},
			
			//跳转到用车申请单明细及流程流转信息页
			gotoTaskDetail(accessTaskId){
				uni.navigateTo({
					url:"/page_car/order/order_detail?accessTaskId="+accessTaskId ,
				})
			},
			
			//底部快捷按钮页面跳转
			gotoPage(flag){
				if(flag=="init"){
					uni.navigateTo({
						url:"/pages/init/init",
					})
				}
			},
			/******************************以上是业务方法*********************************/
			
			/*********************在此之上补充方法**********************/
		},
	}
</script>

<style lang="scss">
@import '../../common/css/page.css'; 
@import '../../common/css/list.css';

</style>